<link rel="stylesheet" href="{{URL::asset('./css/news/news.css')}}">
<link rel="stylesheet" href="{{URL::asset('./css/news/newsDetails.css')}}">


@extends('home.layout.base')
@section('content')
<div class="main">
    <div>
        <div class="newsMain">
            <div class="newsBreadcrumb">
                <span>当前位置：</span>
                <span><a href="{{route('home.index.index') }}">首页</a> > <a href="{{route('home.news.news') }}">所有新闻资讯</a>> @{{detailsData.title}}</span>
            </div>
            <div class="newsContent">
                <div id="newsDetails" v-cloak>
                    <div class="newsDetails">
                        <div class="newsDetails_header">
                            <span>@{{detailsData.title}}</span>
                            <div>
                                <span>
                                    <img src="{{URL::asset('./img/news/detailsCollect.png')}}" alt="">收藏量：@{{detailsData.collect}}
                                </span>
                                <span>
                                    <img src="{{URL::asset('./img/news/detailsEye.png')}}" alt="">浏览量：@{{detailsData.view}}
                                </span>
                                <span>
                                    <img src="{{URL::asset('./img/news/detailsTime.png')}}" alt="">发布时间：@{{detailsData.created_at}}
                                </span>
                                <span>
                                    <img src="{{URL::asset('./img/news/detailsLink.png')}}" alt="">来源：@{{detailsData.source}}
                                </span>
                            </div>
                        </div>
                        <div class="newsDetails_content">
                            <div v-html="detailsData.content">

                            </div>
                            <div class="newsDetails_collect">
                                <img src="{{URL::asset('./img/news/detailsCollect.png')}}" v-if="detailsData.is_collect==1">
                                <img src="{{URL::asset('./img/news/detailsCollectFalse.png')}}" v-else>
                                <span v-if="detailsData.is_collect==1" @click="loginBool">收藏</span>
                                <span v-else>已收藏</span>
                            </div>
                        </div>
                    </div>
                </div>
                @include('home.news.newsHot')
            </div>
        </div>
    </div>
</div>
@endsection
@section('scripts')
<script>
    let newsBreadcrumb = new Vue({
        el: '.newsBreadcrumb',
        data: {
            detailsData: {}
        },
        created() {
            let data = {
                id: getQueryString("id")
            }
            apiAjax("{{ route('home.news.detailsApi')}}", 'get', data, (res) => {
                if (res.code == 0) {
                    this.detailsData = res.data
                } else {}
            }, (erro) => {});
        },
    })
    let newsDe = new Vue({
        el: '#newsDetails',
        data: {
            detailsData: {},
            a: 1
        },
        created() {
            let data = {
                id: getQueryString("id")
            }
            apiAjax("{{ route('home.news.detailsApi')}}", 'get', data, (res) => {
                if (res.code == 0) {
                    this.detailsData = res.data
                } else {
                    this.$message({
                        message: res.msg,
                        type: 'warning'
                    });
                }
            }, (erro) => {});
        },
        methods: {
            loginBool() {
                sessionStorage.setItem("loginBool",true)
            }
        }
    })
</script>
@endsection